let videoApp = new Vue({
    el: '#videoApp',
    data: {
        tags1: '',
        tags2: '',
        tags3: '',
        tags4: '',
        loading: 0, // 加载
        loadings: 0, // 加载
        actor1: '', // 演员1
        actor2: '', // 演员2
        actor3: '', // 演员3
        actor4: '', // 演员4
        actor5: '', // 演员5
        actor6: '', // 演员6
        img1: '', // 图片1
        img2: '', // 图片2
        img3: '', // 图片3
        typedValue: '',
        CosSelectUrl: [],
        selectedOption: '', // 初始值为空
        currentDate: '',
        series: '',
        load: true,
        options: [
            {value: '1', text: '电影'},
            {value: '2', text: '剧集'},
            {value: '3', text: '综艺'},
            {value: '4', text: '动画'}
        ],
        Episode: [
            {episode: '', videoUrl: '', status: ''},
            {episode: '', videoUrl: '', status: ''},
            {episode: '', videoUrl: '', status: ''},
            {episode: '', videoUrl: '', status: ''},
            {episode: '', videoUrl: '', status: ''},
            {episode: '', videoUrl: '', status: ''}
        ],
        Episodes: [
            {episode: '', videoUrl: '', status: ''},
            {episode: '', videoUrl: '', status: ''},
            {episode: '', videoUrl: '', status: ''},
            {episode: '', videoUrl: '', status: ''},
            {episode: '', videoUrl: '', status: ''},
            {episode: '', videoUrl: '', status: ''}
        ],
        video: [], // 视频列表主页
        Series: [],
        next: [],  // 下一页
        yurt: [],  // 国家
        tags: [],  // 视频类型
        year: [],  // 年份
        biao: [],  // 得要标签标
        checkbox: [],  // 是否显示
        isVisible: true,  // 是否显示删除内容
        isMessage: false, // 是否显示消息
        message: '',  // 消息内容 // 消息内容
        movie: [], // 视频信息 视频编辑页面
        insert: {
            name: '',
            imageUrl: '',
            imagesUrl: '',
            videoUrl: '',
            videosUrl: '',
            content: '',
            yurt: '',
            bifen: '',
            year: '',
            biao: '',
            season: '',
            seriesId: '',
            Episode: '',
            ofPlay: '',
            status: '',
            topping: 0
        }, // 插入视频信息
        actor: [], // 视频演员
        ActorBy: [], // 视频演员
        insertOff: false, // 上传开关
        movieType: null, // 视频类型
    },
    methods: {
        // 监听下拉框变化
        handleSelectChange(event) {
            console.log('Selected value:', this.selectedOption);
            this.insertOff = true
            this.movieType = this.selectedOption;
            // 你可以在这里添加其他逻辑
        },
        // 监听自动化下拉框变化
        handleSelectUrlChange(event) {
            console.log('Selected value:', this.typedValue);
        },
        // 获取video视频
        videoApp: function (pageNum) {
            if (pageNum == null) {
                pageNum = 1;
            }
            $.ajax({
                url: '/web/collection/select',
                method: 'GET',
                data: {
                    pageNum: pageNum
                },
                success: function (e) {
                    console.log("videos{}", e);
                    videoApp.load = false;
                    videoApp.next = e;
                    videoApp.video = e.list;
                    for (let i = 0; i < e.list.length; i++) {
                        console.log("videos{}", videoApp.video[i].displayed);
                        if (videoApp.video[i].displayed == 0) {
                            videoApp.video[i].displayed = false;
                        } else {
                            videoApp.video[i].displayed = true;
                        }
                        if (videoApp.video[i].type == 1) {
                            videoApp.video[i].type = "电影";
                        } else if (videoApp.video[i].type == 2) {
                            videoApp.video[i].type = "电视剧";
                        } else if (videoApp.video[i].type == 3) {
                            videoApp.video[i].type = "综艺";
                        } else if (videoApp.video[i].type == 4) {
                            videoApp.video[i].type = "动漫";
                        }
                    }


                }
            })
        },
        // 修改视频是否显示
        oncheckbox: function (e) {
            console.log("e{}", e);
            console.log("e{}", e.target.checked);
            console.log("e{}", e.target.value);
            $.ajax({
                url: '/web/collection/update/displayed',
                method: 'GET',
                data: {
                    id: e.target.value,
                    displayed: e.target.checked ? 1 : 0
                },
                success: function (res) {
                    console.log("res{}", res);
                    if (res.code == OK) {
                        videoApp.onmessage("状态修改成功");
                        console.log("状态成功修改");
                    }
                },
                error: function (e) {
                    console.log("状态修改失败");

                }
            })

        },
        // 收回删除内容
        oncollapse: function (e) {
            videoApp.isVisible = false;
        },
        // 展开删除内容
        oncollapse1: function (e) {
            videoApp.isVisible = true;
        }
        ,
        // 删除视频
        onDeleteById: function (e) {
            console.log("e{}", e);
            let arr = this.video;
            let index = arr.findIndex(item => item.id === e);
            console.log("index{}", index);
            $.ajax({
                url: '/web/collection/deleteById',
                method: 'GET',
                data: {
                    id: e,
                },
                success: function (res) {
                    console.log("res{}", res);
                    if (res.code == OK) {
                        arr.splice(index, 1);
                        videoApp.video = arr;
                        videoApp.isVisible = false;
                        videoApp.onmessage("删除成功");
                    }
                },
                error: function (e) {
                    console.log("删除失败");
                    videoApp.onmessage("删除失败");
                }

            })
        }
        ,
        // 提示框
        onmessage: function (message) {
            videoApp.message = message;
            videoApp.isMessage = true;
            setTimeout(function () {
                videoApp.isMessage = false;
            }, 2000);
        },
        // 通过ID获取视频 进行修改
        handleInput: function (e) {
            var value = null;
            if (e) {
                value = e.target.value;
            }

            if (value === '' || value === null) {
                value = this.movie.id;
            }
            setTimeout(() => {
                console.log('Input changed:', value);
                $.ajax({
                    url: '/web/collection/selectById',
                    method: 'GET',
                    data: {
                        id: value,
                    },
                    success: function (e) {
                        if (e.code == OK) {
                            console.log("videos{}", e.data);
                            videoApp.movie = e.data;
                            videoApp.selectedValue = videoApp.movie.yurt;
                            videoApp.selectedhuiValue = videoApp.movie.status;
                            videoApp.selectedreduValue = videoApp.movie.redu;
                            videoApp.selectedsortValue = videoApp.movie.sort + 1;
                        }
                    }
                })
            }, 2000);

        },
        // 通过ID获取演员信息 进行修改
        handleInputId: function (e) {
            var value = e.target.value;
            setTimeout(() => {
                console.log('Input changed:', value);
                $.ajax({
                    url: '/web/actor/selectById',
                    method: 'GET',
                    data: {
                        id: value,
                    },
                    success: function (e) {
                        if (e.code == OK) {
                            console.log("videos{}", e.data);
                            videoApp.ActorBy = e.data;
                            videoApp.selectedValue = videoApp.ActorBy.sort;
                        } else {
                            videoApp.onmessage("演员不存在");
                        }
                    }
                })
            }, 2000);

        },
        // 通过名称获取演员信息 进行修改
        handleInputText: function (e) {
            var value = e.target.value;
            setTimeout(() => {
                console.log('Input changed:', value);
                $.ajax({
                    url: '/web/actor/selectByText',
                    method: 'GET',
                    data: {
                        name: value,
                    },
                    success: function (e) {
                        if (e.code == OK) {
                            console.log("Actor{}", e.data);
                            videoApp.ActorBy = e.data;
                            videoApp.selectedValue = videoApp.ActorBy.sort;
                        } else {
                            videoApp.onmessage("演员不存在");
                        }
                    }
                })
            }, 3000);

        },
        // 获取热度榜信息
        onyear: function () {
            $.ajax({
                url: '/web/collectionYear/list',
                method: 'GET',
                success: function (res) {
                    console.log("res{}", res);
                    videoApp.year = res;
                },
                error: function (e) {
                    console.log("获取热度榜信息失败");
                }
            })

        },
        // 获取视频类型
        onTags: function () {
            $.ajax({
                url: '/web/collectionTag/list',
                method: 'GET',
                success: function (res) {
                    console.log("res{}", res);
                    videoApp.tags = res;
                },
                error: function (e) {
                    console.log("获取视频类型信息失败");
                }
            })

        },
        onbiao: function () {
            $.ajax({
                url: '/web/biao/list',
                method: 'GET',
                success: function (res) {
                    console.log("res{}", res);
                    videoApp.biao = res;
                },
                error: function (e) {
                    console.log("获取视频标签信息失败");
                }
            })

        },
        tvSeason: function () {
            $.ajax({
                url: '/web/jujiSeries/all',
                method: 'GET',
                success: function (res) {
                    console.log("res{}", res);
                    videoApp.Series = res;
                },
                error: function (e) {
                    console.log("获取视频标签信息失败");
                }
            })

        }
        ,
        // 获取视频国家
        onYurt: function () {
            $.ajax({
                url: '/web/collectionYurt/list',
                method: 'GET',
                success: function (res) {
                    console.log("yurt{}", res);
                    videoApp.yurt = res;
                },
                error: function (e) {
                    console.log("获取视频类型信息失败");
                }
            })

        },

        // 获取视频信息// 修改提交表单的新数据
        handleSubmit: function (e) {
            // 在这里处理提交逻辑
            console.log('提交的数据movie:', this.movie);
            this.loading = 1;
            let t = this.movie;
            t.yurt = this.selectedValue;
            t.status = this.selectedhuiValue;
            t.redu = this.selectedreduValue;
            t.sort = this.selectedsortValue - 1;

            $.ajax({
                url: '/web/video/update',
                method: 'POST',
                data: t,
                success: function (res) {
                    console.log("res{}", res);
                    if (res.code == OK) {
                        videoApp.loading = 0;
                        videoApp.onmessage("修改成功");
                        videoApp.movie = [];
                        videoApp.selectedValue = '';
                        videoApp.selectedhuiValue = '';
                        videoApp.selectedreduValue = '';
                        videoApp.selectedsortValue = '';
                    } else {
                        videoApp.onmessage("修改失败");
                    }
                },
                error: function (e) {
                    console.log("修改失败");
                    videoApp.onmessage("修改失败");
                }
            })
        },
        // 获取演员信息// 修改提交表单的新数据
        handleSubmitActor: function (e) {
            // 在这里处理提交逻辑
            console.log('提交的数据ActorBy{}:', this.ActorBy);
            this.loading = 1;
            let t = this.ActorBy;
            t.sort = this.selectedValue;
            t.gmtCreate = new Date().getTime();
            $.ajax({
                url: '/web/actor/update',
                method: 'POST',
                data: t,
                success: function (res) {

                    console.log("res{}", res);
                    if (res.code == OK) {
                        videoApp.loading = 0;
                        videoApp.onmessage("修改成功");
                        videoApp.ActorBy = [];
                        videoApp.selectedValue = '';
                        videoApp.actorList();
                    } else {
                        videoApp.loading = 0;
                        videoApp.onmessage("修改失败");
                    }
                },
                error: function (e) {
                    console.log("修改失败");
                    videoApp.onmessage("修改失败");
                }
            })
        },
        // 获取视频信息// 插入新数据
        insertSubmit: function (e) {
            // 在这里处理提交逻辑
            let tagsAll = [this.tags1, this.tags2, this.tags3, this.tags4];
            let actorAll = [this.actor1, this.actor2, this.actor3, this.actor4, this.actor5, this.actor6];
            let imgAll = [this.img1, this.img2, this.img3];

            this.insert.type = this.movieType
            this.insert.tagsAll = tagsAll;
            this.insert.actorAll = actorAll;
            this.insert.imgAll = imgAll;
            this.insert.gmtCreate = new Date().getTime();
            this.insert.displayed = this.movieType == 1 || 4 ? 1 : 0;
            console.log('提交的数据insert数据:', this.insert);
            let data = this.insert;

            if (data.name == null) {
                videoApp.onmessage("请输入视频标题");
                return;
            } else if (data.videoUrl == null) {
                videoApp.onmessage("请输入视频原音地址");
                return;
            } else if (data.imageUrl == null) {
                videoApp.onmessage("请输入视频封面地址");
                return;
            } else if (data.content == null) {
                videoApp.onmessage("请输入视频简介");
                return;
            } else if (data.yurt == null) {
                videoApp.onmessage("请选择视频类型");
                return;
            } else if (data.year == null) {
                videoApp.onmessage("请输入视频上映时间");
                return;
            } else if (this.tags1 == null) {
                videoApp.onmessage("请选择视频标签");
                return;
            }
            this.loading = 1;
            $.ajax({
                url: '/web/collection/insert',
                method: 'GET',
                data: data,
                success: function (res) {
                    console.log("res{}", res);
                    if (res.code == OK) {
                        videoApp.loading = 0;
                        videoApp.onmessage("上传成功");
                        videoApp.insert = {};
                        videoApp.tags1 = '';
                        videoApp.tags2 = '';
                        videoApp.tags3 = '';
                        videoApp.tags4 = '';
                        videoApp.actor1 = '';
                        videoApp.actor = '';
                        videoApp.actor1 = '';
                        videoApp.actor2 = '';
                        videoApp.actor3 = '';
                        videoApp.actor4 = '';
                        videoApp.actor5 = '';
                        videoApp.actor6 = '';
                        videoApp.img1 = '';
                        videoApp.img2 = '';
                        videoApp.img3 = '';
                        videoApp.videoApp();
                    }
                },
                error: function (e) {
                    console.log("上传失败{}", e);
                    videoApp.onmessage("上传失败");
                }
            })
        },
        // 插入新演员
        insertSubmitActor: function (e) {
            // 在这里处理提交逻辑
            console.log('提交的数据ActorBy{}:', this.ActorBy);
            let t = this.ActorBy;

            if (t.name == null) {
                videoApp.onmessage("请输入演员名称");
                return;
            } else if (t.url == null) {
                videoApp.onmessage("请输入演员图片Url");
                return;
            } else if (t.gender == null) {
                videoApp.onmessage("请选择性别");
                return;
            } else if (t.content == null) {
                videoApp.onmessage("请输入视频简介");
                return;
            } else if (t.yurt == null) {
                videoApp.onmessage("请选择演员国家区域");
                return;
            }
            this.loading = 1;
            $.ajax({
                url: '/web/actor/insert',
                method: 'POST',
                data: {
                    name: t.name,
                    url: t.url,
                    content: t.content,
                    gender: t.gender,
                    sort: t.yurt,
                    gmtCreate: new Date().getTime(),
                },
                success: function (res) {
                    console.log("res{}", res);
                    if (res.code == OK) {
                        videoApp.loading = 0;
                        videoApp.onmessage("上传成功");
                        videoApp.ActorBy = [];
                        videoApp.actorList();
                    } else {
                        videoApp.onmessage("上传失败");
                        videoApp.loading = 0;
                    }
                },
                error: function (e) {
                    console.log("上传失败{}", e);
                    videoApp.onmessage("上传失败");
                }
            })
        },
        // 删除演员
        handleDeleteActor: function (e) {
            let id = this.ActorBy.id;
            this.loading = 2;
            console.log("id{}", id);
            $.ajax({
                url: '/web/actor/deleteById',
                method: 'POST',
                data: {
                    id: id,
                },
                success: function (res) {
                    console.log("res{}", res);
                    if (res.code == OK) {
                        videoApp.loading = 0;
                        videoApp.onmessage("删除成功");
                        videoApp.ActorBy = [];
                    } else {
                        videoApp.onmessage("删除失败");
                        videoApp.loading = 0;
                    }
                },
                error: function (e) {
                    console.log("删除失败{}", e);
                    videoApp.onmessage("删除失败");
                }
            })
        },
        // 插入Series
        insertSubmitSeries: function () {
            let name = this.series;
            this.loading = 1;
            $.ajax({
                url: '/web/jujiSeries/insert',
                method: 'GET',
                data: {
                    name: name,
                    gmtCreate: new Date().getTime(),
                },
                success: function (res) {
                    console.log("res{}", res);
                    if (res.code == OK) {
                        videoApp.loading = 0;
                        videoApp.onmessage("上传成功");
                        videoApp.series = '';
                        videoApp.tvSeason();
                    } else {
                        videoApp.onmessage("上传失败");
                        videoApp.loading = 0;
                    }
                },
                error: function (e) {
                    console.log("上传失败{}", e);
                    videoApp.onmessage("上传失败");
                }
            })
        },
        // 获取演员信息
        actorList: function (e) {
            $.ajax({
                url: '/web/actor',
                method: 'GET',
                success: function (res) {
                    console.log("actor{}", res);
                    if (res.code == OK) {
                        videoApp.actor = res.data;
                    }
                },
                error: function (e) {
                    console.log("获取演员信息失败");
                }
            })
        },
        // 获取剧集综艺的Url
        // 剧集Url插入
        addUrlSubmit: function (e) {
            this.loading = 1;
            console.log(this.Episode);
            let data = this.Episode.map(item => {
                return {
                    ...item,           // 展开原对象的所有属性（episode, videoUrl, status 等）
                    videoId: this.movie.id  // 添加 videoId 字段
                };
            });
            console.log("处理后的数据（带 videoId）:", data);
            $.ajax({
                url: '/web/collectionUrl/insert',
                method: 'POST',                    // ✅ 改为 POST
                contentType: 'application/json',   // ✅ 告诉后端是 JSON
                data: JSON.stringify(data),        // ✅ 序列化为 JSON 字符串
                success: function (res) {
                    console.log("提交成功:", res);
                    videoApp.loading = 0;
                    if (res.code == OK) {
                        videoApp.Episode = [];
                        videoApp.handleInput(0);
                        videoApp.Episode = videoApp.Episodes;
                        videoApp.onmessage("上传成功");
                    }
                    // 处理成功响应
                },
                error: function (xhr, status, error) {
                    videoApp.loading = 0;
                    videoApp.onmessage("提交失败");
                    console.log("提交失败:", error);
                    console.log("响应内容:", xhr.responseText);
                }
            });
        },
        // 自动化插入
        addUrlAptematicSubmit: function (e) {
            this.loading = 1;
            console.log(this.CosSelectUrl);
            let data = this.CosSelectUrl.map(item => {
                return {
                    ...item,
                    videoUrl: item.cdnUrl,
                    videoId: this.movie.id  // 添加 videoId 字段
                };
            });
            console.log("处理后的数据（带 videoId）:", data);
            $.ajax({
                url: '/web/collectionUrl/insert',
                method: 'POST',                    // ✅ 改为 POST
                contentType: 'application/json',   // ✅ 告诉后端是 JSON
                data: JSON.stringify(data),        // ✅ 序列化为 JSON 字符串
                success: function (res) {
                    console.log("提交成功:", res);
                    if (res.code == OK) {
                        videoApp.CosSelectUrl = [];
                        videoApp.loading = 0;
                        videoApp.movie = [];
                        videoApp.onmessage("上传成功");
                    }
                    // 处理成功响应
                },
                error: function (xhr, status, error) {
                    ofPlayApp.loading = 0;
                    ofPlayApp.onmessage("提交失败");
                    console.log("提交失败:", error);
                    console.log("响应内容:", xhr.responseText);
                }
            });
        },
        handleUrlInput: function () {
            this.loadings = 1;
            if (this.typedValue == null || this.typedValue == '') {
                videoApp.onmessage("请选择类型");
                return;
            }
            const type = this.typedValue;
            var value = this.movie.name;
            const CosSelectUrls = '中文/' + type + '/' + value;
            console.log('CosSelectUrls:', CosSelectUrls);
            $.ajax({
                url: '/api/cos/list',
                method: 'GET',
                data: {
                    folderPath: CosSelectUrls,
                },
                success: function (e) {
                    console.log("成功", e.files);
                    for (let i = 0; i < e.files.length; i++) {
                        e.files[i].status = 1;
                        e.files[i].episode = i + 1;
                    }
                    videoApp.CosSelectUrl = e.files;
                    videoApp.loadings = 0;
                }
            })


        },


        // 获取当前时间
        formatDate(date) {
            const year = date.getFullYear();
            const month = String(date.getMonth() + 1).padStart(2, '0');
            const day = String(date.getDate()).padStart(2, '0');
            const hours = String(date.getHours()).padStart(2, '0');
            const minutes = String(date.getMinutes()).padStart(2, '0');
            const seconds = String(date.getSeconds()).padStart(2, '0');
            return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
        },
        updateDate() {
            const now = new Date();
            this.currentDate = this.formatDate(now);
        }

    }, created: function () {
        // 初始化日期
        this.updateDate();
        // 每秒更新时间
        this.interval = setInterval(this.updateDate, 1000);
        this.actorList();
        this.onYurt();
        this.onyear();
        this.onTags();
        this.onbiao();
        this.tvSeason();

        this.videoApp();
    },
    beforeDestroy() {
        // 清除定时器
        clearInterval(this.interval);
    }
})